import 'package:flutter/material.dart';
import 'package:fluttertoast/fluttertoast.dart';

class SliverListThreeScreen extends StatefulWidget {
  @override
  SliverListState createState() => SliverListState();
}

class SliverListState extends State<SliverListThreeScreen>
    with SingleTickerProviderStateMixin {
  TabController tabController;

  @override
  void initState() {
    super.initState();
    this.tabController = TabController(length: 2, vsync: this);
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: CustomScrollView(
        slivers: <Widget>[
          SliverAppBar(
            leading: IconButton(
              icon: Icon(Icons.arrow_back_ios),
              onPressed: (){
                Navigator.pop(context);
              },
            ),
            pinned: true,
            elevation: 5,
            expandedHeight: 250,
            forceElevated: false,
            flexibleSpace: FlexibleSpaceBar(
              title: Text('大鸡腿一个'),
              background: Image.network(
                  'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1587968152169&di=7865d55b111cb87c0685a0f7e69f66b5&imgtype=0&src=http%3A%2F%2Fdingyue.ws.126.net%2F2020%2F0403%2F9fbd08dcj00q8736o000tc000hs00drm.jpg',
                  fit: BoxFit.cover),
            ),

            actions: <Widget>[
              IconButton(icon: Icon(Icons.share), onPressed: () {}),

              IconButton(icon: Icon(Icons.shopping_cart), onPressed: () {}),

              PopupMenuButton(
                  padding: EdgeInsets.all(0),
                  onSelected: (String action) {
                    switch (action) {
                      case 'one':
                        Fluttertoast.showToast(msg: 'one');
                        break;
                      case 'two':
                        Fluttertoast.showToast(msg: 'two');
                        break;
                    }
                  },
                  onCanceled: (){
                    Fluttertoast.showToast(msg: 'cancel');
                  },
                  itemBuilder: (context) {
                    return [
                      PopupMenuItem(child: Text('菜单一'), value: 'one',),
                      PopupMenuItem(child: Text('菜单二'), value: 'two',)
                    ];
                  })
            ],
          ),
          SliverPersistentHeader(
            pinned: true,
            delegate: StickyTabBarDelegate(
              child: TabBar(
                labelColor: Colors.black,
                controller: this.tabController,
                indicatorWeight: 3,
                indicatorSize: TabBarIndicatorSize.label,
                tabs: <Widget>[
                  Tab(
                    text: 'Home',
                  ),
                  Tab(
                    text: 'Profile',
                  )
                ],
              ),
            ),
          ),
          SliverFillRemaining(
            child: TabBarView(controller: this.tabController, children: [
              CustomScrollView(
                physics: NeverScrollableScrollPhysics(),
                slivers: <Widget>[
                  SliverFixedExtentList(
                    delegate: SliverChildBuilderDelegate(
                            (context, index) =>
                            ListTile(
                              title: Text('标题$index'),
                            ),
                        childCount: 2),
                    itemExtent: 40.0,
                  ),

                  SliverSafeArea(
                      sliver: SliverPadding(
                        //显示区域距离上下左右的边距
                          padding: EdgeInsets.all(10),
                          //显示的内
                          sliver: SliverGrid(
                              delegate: SliverChildListDelegate([
                                InkWell(
                                  onTap: () =>
                                      Fluttertoast.showToast(
                                          msg: "点击了Body1"),
                                  child: Container(
                                      color: Colors.lightGreen,
                                      child: Text("内容Body1"),
                                      alignment:
                                      Alignment.center),
                                ),
                                Ink(
                                  decoration: BoxDecoration(
                                      color: Colors.green,
                                      borderRadius:
                                      BorderRadius.all(
                                          Radius.circular(
                                              10.0))),
                                  child: InkResponse(
                                    borderRadius:
                                    BorderRadius.all(
                                        Radius.circular(
                                            10.0)),
                                    //点击或者touch的显示在控件上层，水波纹下层
                                    highlightColor:
                                    Colors.purple[800],
                                    //点击控件的Shape形状
                                    highlightShape:
                                    BoxShape.rectangle,
                                    //水波纹半径
                                    //radius: 500.0,
                                    //水播放的颜色
                                    splashColor:
                                    Colors.green[200],
                                    //水波纹是否需要裁减，false不裁减，不裁减是矩形
                                    containedInkWell: true,

                                    onTap: () =>
                                        Fluttertoast.showToast(
                                            msg: "水波纹的响应事件"),
                                    child: Container(
                                      //不能在容器内部设置颜色，否则会遮盖水波纹颜色
                                      //color: Colors.lightGreen,
                                        child: Text("内容Body1"),
                                        alignment:
                                        Alignment.center),
                                  ),
                                ),
                                Container(
                                    color: Colors.lightGreen,
                                    child: Text("内容Body1"),
                                    alignment: Alignment.center),
                                Container(
                                    color: Colors.lightGreen,
                                    child: Text("内容Body1"),
                                    alignment: Alignment.center),
                                Container(
                                    color: Colors.lightGreen,
                                    child: Text("内容Body1"),
                                    alignment: Alignment.center),
                                Container(
                                    color: Colors.lightGreen,
                                    child: Text("内容Body1"),
                                    alignment: Alignment.center),
                                Container(
                                    color: Colors.lightGreen,
                                    child: Text("内容Body1"),
                                    alignment: Alignment.center),
                                Container(
                                    color: Colors.lightGreen,
                                    child: Text("内容Body1"),
                                    alignment: Alignment.center),
                              ], semanticIndexOffset: 10),
                              gridDelegate:
                              SliverGridDelegateWithFixedCrossAxisCount(
                                  crossAxisCount: 2,
                                  mainAxisSpacing: 10.0,
                                  crossAxisSpacing: 10.0,
                                  //布局的宽高比
                                  childAspectRatio: 1.0)
                          )
                      )
                  ),
                ],
              ),
              Center(
                child: Text('Content of Profile'),
              )
            ]),
          )
        ],
      ),
    );
  }
}

class StickyTabBarDelegate extends SliverPersistentHeaderDelegate {
  final TabBar child;

  StickyTabBarDelegate({@required this.child});

  @override
  Widget build(BuildContext context, double shrinkOffset,
      bool overlapsContent) {
    return Material(
      child: this.child,
    );
  }

  @override
  double get maxExtent => this.child.preferredSize.height;

  @override
  double get minExtent => this.child.preferredSize.height;

  @override
  bool shouldRebuild(SliverPersistentHeaderDelegate oldDelegate) {
    return true;
  }
}
